<extend name="Common/base"/>
<block name="cssjs">
<css href="__PUBLIC__/bootstrap/css/bootstrap.min.css,__PUBLIC__/bootstrap/css/bootstrap-theme.min.css,__PUBLIC__/validator/jquery.validator.css,__PUBLIC__/css/admin_all.css"/>
<js href="__PUBLIC__/js/jquery.min.js,__PUBLIC__/bootstrap/js/bootstrap.min.js,__PUBLIC__/validator/jquery.validator.js,__PUBLIC__/validator/local/{$Think.LANG_SET}.js,__PUBLIC__/js/admin_all.js"/>
</block>
<block name="body">
<div class="container">
    <div class="login_logo">
        <h1>
            <span class="glyphicon glyphicon-leaf green"></span>
            <span class="red">{:L('PRO_NAME')}</span>
            <span class="white">{:L('BACKER_MANAGE')}</span>
        </h1>
        <h4 class="blue">&COPY; {:L('COMPANY_NAME')}</h4>
    </div>
    <div class="login_box">
        <div class="login_body">
            <div class="login_main">
                <h4 class="blue">
                    <span class="glyphicon glyphicon-road green"></span>
                    {:L('INPUT_INFO')}
                </h4>
                <form id="admin_login"><!--action="{:U('Public/login')}" method="post"-->
                    <label class="login_input">
                        <input type="text" name="username" placeholder="{:L('LOGIN_ACCOUNT')}"/>
                        <span class="glyphicon glyphicon-user"></span>
                    </label>
                    <label class="login_input">
                        <input type="password" name="password" placeholder="{:L('LOGIN_PWD')}" />
                        <span class="glyphicon glyphicon-lock"></span>
                    </label>
                    <label class="login_input">
                        <input type="text" name="verify" placeholder="{:L('LOGIN_VERIFY')}"/>
                        <img class="verifyimg" src="{:U('Public/verify')}" alt="{:L('LOGIN_VERIFY')}"/>
                    </label>
                    <div class="login_send">
                        <label class="inline">
                            <input type="checkbox" name="keep"/><span class="chb">{:L('KEEP_ME')}</span>
                        </label>
                        <button class="pull-right btn btn-sm btn-primary" type="submit">
                            <span class="glyphicon glyphicon-log-in"></span>
                            &emsp;{:L('LOGIN')}
                        </button>
                    </div>
                </form>
            </div>
            <div class="login_floot">
                <a class="forgot_pwd" href="#"><span class="glyphicon glyphicon-arrow-left"></span> {:L('FORGET_PWD')}</a>
                <a class="want_reg" href="#">{:L('I_WANT_REG')} <span class="glyphicon glyphicon-arrow-right"></span></a>
            </div>
        </div>
    </div>
</div>
<div id="login_modal" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
        <div class="alert alert-warning" role="alert">
            <span class="glyphicon glyphicon-warning-sign"></span>
            <span class="info"></span>
        </div>
    </div>
  </div>
</div>
<!--[if IE 8]>
<script type="text/javascript">
$(function(){
    $('.chb').toggle(function(){
        $(this).before('<b><span class="glyphicon glyphicon-ok"></span><input type="hidden" name="keep" value="on"/></b>');
    },function(){
        $(this).parent().find('b').remove();
    });
});
</script>
<style type="text/css">
.inline b{
    width:15px;
    height:15px;
    border:1px solid #c8c8c8;
    background-color:#fff;
    color: #32a3ce;
    font-size:10px;
    display:inline-block;
    margin-right:5px
}
</style>
<![endif]-->
<script type="text/javascript">
$('#admin_login').validator({
    msgStyle:'position:absolute;top:0;right:-5px;',
    rules:{
        loginName : function(element){
            return this.test(element, "username")===true || this.test(element, "email")===true || '{:L('CHECK_INFO')}';
        }
    },
    fields:{
        'username':'required;loginName',
        'password':'required;password',
        'verify':'required;verify'
    },
    valid : function(form){
        var me = this;
        me.holdSubmit();
        $.post('{:U('Public/login')}',$(form).serialize(),success,'json');
        function success(data){
            if(data.status){
                $('#login_modal .alert').removeClass('alert-warning').addClass('alert-success');
                $('#login_modal .glyphicon').removeClass('glyphicon-warning-sign').addClass('glyphicon glyphicon-ok');
                $('#login_modal .info').text(' '+data.info+'{:L('JUMP_INFO')}');
                $('#login_modal').modal('show');
                setTimeout(function(){
                    window.location.href = data.url;
                },1000);
            }else{
                $('#login_modal .info').text(' '+data.info);
                $('#login_modal').modal('show');
                setTimeout(function(){
                    $('#login_modal').modal('hide');
                    var verifyimg = $(".verifyimg").attr("src");
                    if( verifyimg.indexOf('?')>0){
                        $(".verifyimg").attr("src", verifyimg+'&random='+Math.random());
                    }else{
                        $(".verifyimg").attr("src", verifyimg.replace(/\?.*$/,'')+'?'+Math.random());
                    }
                    me.holdSubmit(false);
                    $(".login_input").find("input[name=verify]").focus();
                },2000);
            }
        }
    }
});
</script>
</block>